<button nz-button nzType="primary">Primary Button</button>
<br/>
<button nz-button nzType="default">Default Button</button>
<br/>
<button nz-button nzType="dashed">Dashed Button</button>
<br/>
<button nz-button nzType="text">Text Button</button>
<br/>
<a nz-button nzType="link">Link button</a>
<br/>
<br/>
<br/>
<button nz-button nzType="primary" nzShape="circle">
    <i nz-icon nzType="search" nzTheme="outline"></i>
</button>
<button nz-button nzType="primary" nzShape="circle">A</button>
<button nz-button nzType="primary">
    <i nz-icon nzType="search" nzTheme="outline"></i>
    Search
</button>
<button nz-button nzType="default" nzShape="circle">
    <i nz-icon nzType="search" nzTheme="outline"></i>
</button>
<button nz-button nzType="default">
    <i nz-icon nzType="search" nzTheme="outline"></i>
    Search
</button>
<button nz-button nzType="dashed" naShape="circle">
    <i nz-icon nzType="search" nzTheme="outline"></i>
</button>
<button nz-button nzType="dashed">
    <i nz-icon nzType="search" nzTheme="outline"></i>
    Search
</button>
<br/>
<br/>
<nz-radio-group [(ngModel)]="size">
    <label nz-radio-button nzValue="large">Large</label>
    <label nz-radio-button nzValue="default">Default</label>
    <label nz-radio-button nzValue="small">Small</label>
</nz-radio-group>
<br/>
<br/>
<button nz-button [nzSize]="size" nzType="primary">Primary</button>
<button nz-button [nzSize]="size" nzType="default">Default</button>
<button nz-button [nzSize]="size" nzType="dashed">Dashed</button>
<button nz-button [nzSize]="size" nzType="link">Link</button>
<button nz-button nzType="primary" [nzSize]="size">
    <i nz-icon nzType="download" nzTheme="outline"></i>
</button>
<button nz-button [nzSize]="size" nzType="primary" nzShape="circle">
    <i nz-icon nzType="download" nzTheme="outline"></i>
</button>
<button nz-button [nzSize]="size" nzShape="round" nzType="primary">
    <i nz-icon nzType="download" nzTheme="outline"></i>
</button>
<button nz-button nzType="primary" nzShape="round" [nzSize]="size">
    <i nz-icon nzType="download" nzTheme="outline"></i>
    Download
</button>
<button nz-button nzType="primary" [nzSize]="size">
    <i nz-icon nzType="download" nzTheme="outline"></i>
    Download
</button>

<nz-button-group [nzSize]="size">
    <button nz-button nzType="primary">
        <i nz-icon nzType="left" nzTheme="outline"></i>
        Backward
    </button>
    <button nz-button nzType="primary">
        Forward
        <i nz-icon nzType="right" nzTheme="outline"></i>
    </button>
</nz-button-group>
<br/>
<br/>
<br/>
<button nz-button nzType="primary">Primary</button>
<button nz-button nzType="primary" disabled>Primary(disabled)</button>
<br/>
<button nz-button nzType="default">Default</button>
<button nz-button nzType="default" disabled>Default(disabled)</button>
<br/>
<button nz-button nzType="dashed">Dashed</button>
<button nz-button nzType="dashed" disabled>Dashed(disabled)</button>
<br/>
<a nz-button nzType="text">Text</a>
<a nz-button nzType="text" disabled>Text(disabled)</a>
<br/>
<a nz-button nzType="link">Link</a>
<a nz-button nzType="link" disabled>Link(disabled)</a>
<br/>
<a nz-button nzType="text" nzDanger>Danger Text</a>
<a nz-button nzType="text" disabled nzDanger>Danger Text(disabled)</a>
<br/>
<a nz-button nzType="link" nzDanger>Danger Link</a>
<a nz-button nzType="link" nzDanger disabled>Danger Link(disabled)</a>
<br/>
<button nz-button nzType="default" nzDanger>Danger Default</button>
<button nz-button nzType="default" nzDange disabled>Danger Default(disabled)</button>
<div style="padding: 8px 8px 8px; background: rgb(190, 200, 200);">
    <button nz-button nzGhost>Ghost</button>
    <button nz-button nzGhost disabled>Ghost(disabled)</button>
</div>
<br/>
<br/>
<br/>
<button nz-button  nzType="primary" nzLoading>
    <i nz-icon nzType="loading" nzTheme="outline"></i>
    Loading
</button>
<button nz-button nzType="primary" nzSize="small" nzLoading>
    <i nz-icon nzType="loading" nzTheme="outline"></i>
    Loading
</button>
<button nz-button nzType="primary" (click)="loadingOne()" [nzLoading]="isLoadingOne">
    Click me!
</button>
<button nz-button nzType="primary" (click)="loadingTwo()" [nzLoading]="isLoadingTwo">
    <i nz-icon nzType="poweroff" nzTheme="outline"></i>
    Click me!
</button>
<button nz-button nzType="default" nzLoading nzShape="circle">
    <i nz-icon nzType="loading" nzTheme="outline"></i>
</button>
<button nz-button nzType="primary" nzLoading nzShape="circle">
    <i nz-icon nzType="loading" nzTheme="outline"></i>
</button>
<br/>
<br/>
<br/>
<button nz-button nzType="primary">primary</button>
<button nz-button nzType="default">secondary</button>
<button nz-button nz-dropdown [nzDropdownMenu]="menu">
    Actions
    <i nz-icon nzType="down" nzTheme="outline"></i>
</button>
<nz-dropdown-menu #menu="nzDropdownMenu">
    <ul nz-menu>
        <li nz-menu-item>
            <a>1st item</a>
        </li>
        <li nz-menu-item>
            <a>2nd item</a>
        </li>
        <li nz-menu-item>
            <a>3rd item</a>
        </li>
    </ul>
</nz-dropdown-menu>
<br/>
<br/>
<br/>
<div style="background: rgb(190,200,200); padding: 26px 16px 16px;">
    <button nz-button nzType="primary" nzGhost>Primary</button>
    <button nz-button nzType="default" nzGhost>Default</button>
    <button nz-button nzType="dashed" nzGhost>Dashed</button>
    <a nz-button nzType="link" nzGhost>Link</a>
</div>
<br/>
<br/>
<br/>
<nz-button-group>
    <button nz-button nzType="primary">
        <i nz-icon nzType="left" nzTheme="outline"></i>
        Go back
    </button>
    <button nz-button nzType="primary">
        Go forward
        <i nz-icon nzType="right" nzTheme="outline"></i>
    </button>
</nz-button-group>
<nz-button-group>
    <button nz-button nzType="primary">
        <i nz-icon nzType="cloud" nzTheme="outline"></i>
    </button>
    <button nz-button nzType="primary">
        <i nz-icon nzType="cloud-download" nzTheme="outline"></i>
    </button>
</nz-button-group>
<br/>
<br/>
<br/>
<button nz-button nzType="primary" nzBlock>Primary</button>
<button nz-button nzType="default" nzBlock>Default</button>
<button nz-button nzType="dashed" nzBlock>Dashed</button>
<button nz-button nzType="text" nzBlock>Text</button>
<a nz-button nzType="link" nzBlock>Link</a>
<br/>
<br/>
<br/>
<button nz-button nzType="primary" nzDanger>Primary</button>
<button nz-button nzType="default" nzDanger>Default</button>
<button nz-button nzType="dashed" nzDanger>Dashed</button>
<button nz-button nzType="text" nzDanger>Text</button>
<a nz-button nzType="link" nzDanger>Link</a>
<br/>
<br/>
<br/>
<!-- <article nz-typography>
    <h1 nz-typography>Introduction</h1>
    <p nz-typography>In the process of internal desktop applications development, many different design specs and implementations would be involved, which might cause designers and developers difficulties and duplication and reduce the efficiency of development.</p>
    <p nz-typography>After massive project practice and summaries, Ant Design, a design language for backgroundapplications, is refined by Ant UED Team, which aims to
        <span nz-typography>
            <strong>uniform the user interface specs for internal background projects, lower the unnecessary cost of design differences and implementation and liberate the resources ofdesign and front-end development .</strong>
        </span>
    </p>
    <h2 nz-typography>Guidelines and Resources</h2>
    <p nz-typrgraphy>We supply a series of design principles, practical patterns and high quality design resources (
        <span nz-typergraphy><code>Sketch</code></span>and<span nz-typography><code>Axure</code></span>), to help people create their product prototypes beautifully and efficiently.</p>
    <div nz-typography>
        <ul>
            <li>
                <a href="https://ng.ant.design/docs/spec/proximity">Principles</a>
            </li>
            <li>
                <a href="https://ng.ant.design/docs/pattern/navigation">Patterns</a>
            </li>
            <li>
                <a href="https://ng.ant.design/docs/resource/download">Resources Download</a>
            </li>
        </ul>
    </div>
    <p nz-typography>Press
        <span nz-typogrphy><kbd>Esc</kbd></span> to exist
    </p>
</article> -->